// 样式-标签设置
import React from 'react';
import { Switch } from 'antd';
import FormItem from 'antd/lib/form/FormItem';
// import { filterObjectNullKeys } from 'src/libs/utils';
import Editor from '../Editor';

interface IProps {
	config: any;
	onValuesChange: ( chartType: string, key: string, values: Object, configType: string ) => void;
	form: any;
}

const MapLabel = ( props: IProps ) => {
	// const { Panel } = Collapse;
	const { config, onValuesChange, form } = props;

	return (
		<div key="maplabel">
			<FormItem label="是否显示" name="isMapLabelShow" valuePropName="checked" labelAlign="left" labelCol={{ span: 8 }} wrapperCol={{ span: 16 }}>
				<Switch defaultChecked={true} />
			</FormItem>
			<FormItem label="字体" labelAlign="left" labelCol={{ span: 8 }} wrapperCol={{ span: 16 }}>
				<Editor
					config={config}
					form={form}
					onValuesChange={onValuesChange}
					fontFamilyName="mapLabelFontFamily"
					fontSizeName="mapLabelFontSize"
					fontColorName="mapLabelFontColor"
					boldName="mapLabelIsBold"
					italicName="mapLabelIsItalic"
					underLineName="mapLabelIsUnderLine"
					alignHorName="mapLabelAlignHor"
					alignVerName="mapLabelAlignVer"
					fontConfig={[ 'fontFamily', 'fontSize', 'fontColor', 'fontBold',
						'fontItalic' ]}
				/>
			</FormItem>
		</div>
	);
};

export default React.memo( MapLabel );
